﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ChangePassword.aspx.cs" Inherits="GPSTrackingWebsiteManager.Manager.Pages.ChangePassword" %>

<!DOCTYPE html>

<link href="../../Css/GPSTrackingWebsite.css" rel="stylesheet" />
<link href="../../Css/messi.css" rel="stylesheet" />
<script src="../../Javascript/jquery-1.11.1.min.js"></script>
<script src="../../Javascript/messi.js"></script>
<script src="../../Javascript/Custom.js"></script>
<script src="../../Javascript/WindowMessageManager.js"></script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
     <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            function checkPasswordMatch() {
                var text1 = $find("<%=txtPassword1.ClientID %>").get_textBoxValue();
                var text2 = $find("<%=txtPassword2.ClientID %>").get_textBoxValue();

                if (text2 == "") {
                    $get("PasswordRepeatedIndicator").innerHTML = "";
                    $get("PasswordRepeatedIndicator").className = "Base L0";
                }
                else if (text1 == text2) {
                    $get("PasswordRepeatedIndicator").innerHTML = "Iguales";
                    $get("PasswordRepeatedIndicator").className = "Base L5";
                }
                else {
                    $get("PasswordRepeatedIndicator").innerHTML = "No son Iguales";
                    $get("PasswordRepeatedIndicator").className = "Base L1";
                }
            }

            //Windows Message Manager 
            var objWindowsMessageManager = new WindowsMessageManager();
        </script>

    </telerik:RadCodeBlock>
    
    <style type="text/css">
        .auto-style1 {
            width: 100%;
        }
    </style>
</head>
<body style="overflow: hidden">
    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
    <div>
       <h2>Cambio contraseña</h2>
        <fieldset>
                <legend>Cambio de contraseña</legend>
        <table class="auto-style1">
            <tr>
                <td>Contraseña actual:</td>
                <td>
                    <telerik:RadTextBox ID="txtPasswordNow" Runat="server" TextMode="Password" Width="130px">
                    </telerik:RadTextBox>
                </td>
            </tr>
            <tr>
                <td>Nueva contraseña:</td>
                <td>
                    <telerik:RadTextBox ID="txtPassword1" Runat="server" TextMode="Password"
                         onkeyup="checkPasswordMatch()" EnableSingleInputRendering="false" Width="130px">
                                            <PasswordStrengthSettings ShowIndicator="true" TextStrengthDescriptions="Simple;Fácil;Normal;Difícil;Muy Difícil"
                                                IndicatorElementBaseStyle="Base" TextStrengthDescriptionStyles="L0;L1;L2;L3;L4;L5"
                                                IndicatorElementID="CustomIndicator"></PasswordStrengthSettings>
                    </telerik:RadTextBox>
                </td>
            </tr>
            <tr>
                <td>Repita contraseña:</td>
                <td>
                    <telerik:RadTextBox ID="txtPassword2" Runat="server" TextMode="Password"
                         onkeyup="checkPasswordMatch()" EnableSingleInputRendering="false" Width="130px">
                    </telerik:RadTextBox>
                </td>
            </tr>
            <tr>
                <td>Nivel de contraseña:</td>
                <td> <span id="CustomIndicator">&nbsp;</span> <span id="PasswordRepeatedIndicator" class="Base L0">&nbsp;</span></td>
            </tr>
            <tr>
                <td colspan="2">
                    <div class="center">
                    <telerik:RadButton ID="btnSave" runat="server" Text="Guardar Cambios" OnClick="btnSave_Click">
                    </telerik:RadButton>
                        </div>
                </td>
            </tr>
        </table>
    </fieldset>
    </div>
    </form>
</body>
</html>
